<!-- 顶部横向滚动导航
高度： 45
传递数组：
-->
<template>
	<view class="">
		<scroll-view scroll-x class="bg-white nav" scroll-with-animation :scroll-left="scrollLeft">
			<view
				class="cu-item"
				:class="index == TabCur ? 'text-blue cur' : ''"
				v-for="(item, index) in navs"
				:key="index"
				@tap="tabSelect(item, index)"
			>
				{{ item.title }}
			</view>
		</scroll-view>
	</view>
</template>

<script>
export default {
	props: {
		navs: {
			type: Array,
			default: () => []
		}
	},
	data() {
		return {
			TabCur: 0, // 当前选中的tab项
			scrollLeft: 0
		};
	},
	methods: {
		tabSelect(item, index) {
			this.TabCur = index;
			this.scrollLeft = (index - 1) * 60;
			this.$emit('tabChange', item);
		}
	}
};
</script>

<style></style>
